<!--  -->
<template>
    <div class="addresslist">
        <!-- <HeaderTop title="收货地址"></HeaderTop> -->
        <section class="addressL">
            <van-address-list
                v-model="chosenAddressId"
                :list="newAddressList"
                @add="onAdd"
                @edit="onEdit"
                @select="selectAddress"
                id="aaa"
            />
        </section>
    </div>
</template>

<script>
// import HeaderTop from '../HeaderTop/HeaderTop'
import {mapState} from 'vuex'
import {mapActions} from 'vuex'
import PubSub from 'pubsub-js'

export default {
  data () {
    return {
        chosenAddressId: this.$store.state.orderAddress.id,
        userId:null,
        token:'',
        newAddressList:[]
    };
  },

    // components: {
    //     HeaderTop
    // },
    created () {
    },
    mounted(){
        this.userId = this.userInfo.userInfo.id
        this.token = this.userInfo.token
        this.getAddressList({userId:this.userId,token:this.token})
        console.log()
        this.newList()
    },
    computed: {
        ...mapState(['userInfo','addressList']),
        // newAddressList(){
        //     // 拿到从后台获取的地址 遍历更改地址字段
        //     // alert('ifDefault')
        //     // alert(this.addressList[0].ifDefault)
        //     // alert(this.addressList[0].ifDefault == 1)
        //     // alert(this.addressList)
        //     const list2 = []
        //     this.addressList.forEach((item,index)=>{
        //         const obj = {}
        //         obj.id = item.id
        //         obj.name = item.consignee
        //         obj.tel = item.mobile
        //         obj.address = item.area+item.city+item.county+item.address 
        //         obj.userId = item.userId
        //         obj.isDefault = item.ifDefault == 0 ? true : false
        //         list2.push(obj)
        //     })
        //     return list2
        // }
    },

    methods: {
        ...mapActions(['getAddressList']),
        async newList(){
            const params = {
                userId: localStorage.getItem('userId'),
                token: localStorage.getItem('token'),
            }
            const result = await this.API.reqAddressList(params)
            if(result.retCode === '000'){
                result.retData.forEach((item,index)=>{
                    const obj = {}
                    obj.id = item.id
                    obj.name = item.consignee
                    obj.tel = item.mobile
                    obj.address = item.area+item.city+item.county+item.address 
                    obj.userId = item.userId
                    obj.isDefault = item.ifDefault == 0 ? true : false
                    this.newAddressList.push(obj)
                })
            }
            console.log('地址', this.newAddressList)
        },
        onAdd() {
            console.log('新增地址');
            this.$router.push({path: '/addaddress', query: {check: this.$route.query.check}})
        },
        onEdit(item, index) {
            // console.log('编辑地址:' + index);
            const addressId = this.newAddressList[index].id
            // const oneAddress = this.newAddressList[index]
            // console.log(oneAddress)
            // 发布消息 把地址传给ModiAddress.vue页面
            // PubSub.publish('modifine',oneAddress)
            this.$router.push({path:'/modiaddress',query:{id:addressId}})
        },
        selectAddress (item) {
            if (this.$route.query.check) {
                console.log('hahahahhahha ',item)
                // this.$store.state.orderAddress = item
                this.$router.push({
                    name: 'confirmorder',
                    params: item
                })
            }
        }
    }
}

</script>
<style lang='stylus'>
.addressL
    .van-address-list
        .van-radio-group
            .van-address-item 
                height 80px
                padding-left 0
                .van-radio
                    border none
                    .van-radio__input
                        display none
                        .van-icon-checked 
                            color #145B3E
                    .van-radio__label
                        width 85%
                        color #000
                        .van-address-item__address
                            color #000
                            font-size 14px
                &:first-of-type
                    background-image url(./img/mr.png)
                    background-repeat no-repeat
                    background-size 30px 25px
                    background-position 0 50%
        .van-button--danger
            background #145B3E
            border 1px solid #145B3E
            outline none 
</style>

<style lang='stylus' scoped>
    // .addresslist
    //     margin-top 45px

</style>